* { margin: 0; padding: 0; }

body { font-family: verdana, arial, sans-serif; color: black; font-size: 0.8em; }

#mainwrap { position: absolute; top: 0; bottom: 0; left: 0; right: 0; background-color: gray; }

#index { position: absolute; top: 0; bottom: 0; left: 0; right: 75%; background-color: white; }

#index_slider { width: 100%; height: 100%; max-height: 100%; overflow-y: scroll; }

#index_slider h1 { padding: 0.2em; font-size: 1.5em; }

#index_slider ul { list-style-type: none; margin-left: 0.7em; }

#index_slider span { display: block; padding: 0.3em; margin-right: 0.7em; color: navy; border-radius: 0.3em; background-color: #eee; }
#index_slider a { color: black; text-decoration: none; transition: color 0.25s, background-color 0.25s; display: block; padding: 0.3em; margin-right: 0.7em; border-radius: 0.3em; }
#index_slider a:hover { color: navy; background-color: silver; }
#index_slider a.selected { color: blue; }
#index_slider a.selected:hover { color: darkblue; background-color: gray; }

#content { position: absolute; top: 0; bottom: 0; right: 0; left: 25%; background-color: gray; }

#content_iframe_id { display: block; width: 100%; height: 99.9%; border: 0; }